import { useEffect, useRef } from 'react'

export function useClickOutside(handler, listenCapturing = false) {
	const ref = useRef(null)
	useEffect(() => {
		const handleClickOutside = (event) => {
			if (ref.current && !ref.current.contains(event.target)) {
				handler()
			}
		}
		document.addEventListener('click', handleClickOutside, listenCapturing)
		return () => {
			document.removeEventListener('click', handleClickOutside, listenCapturing)
		}
	}, [handler, listenCapturing])
	return ref
}
